
<template>
  <section class="main-bg">
      <img src="./bg.png" alt="">
      <section class="main-bg-personality-card">
          <img src="./personality-card1.png" alt="">
      </section>
      <enter></enter>
  </section>
</template>
<script>
import enter from "./enter/enter";
export default {
  components:{
      enter,
  }
}
</script>
<style lang="scss">
@import "../../../../assets/scss/_index.scss";
.main-bg{
    position: relative;
    width: 100%;
    height: px2rem(356);
    background: #ead9bd;
    img{
        // z-index: -1;
        width: 100%;
    }
    &-personality-card{
        position: absolute;
        top: px2rem(40);
        left: 50%;
        transform: translateX(-50%);
        width: px2rem(180);
        height: px2rem(180);
        border: 2px solid #fff;
        border-radius: px2rem(90);
        background: #000;
        img{
            width: 100%;
        }
    }
}

</style>
